<template>
  <el-input v-model="numValue" :placeholder="placeholder" :disabled="disabled"  @keyup.native="change($event)" @blur="blur($event)"></el-input>
</template>
<script>
  import util from '../../utils/util'
  export default {
    name: 'rf-input-money',
    props: {
      money: { //
        type: [String, Number]
      },
      placeholder: {
        type: String
      },
      limitYI: { // 限制不能超过亿位
        type: Boolean,
        default: true
      },
      canMinus: { // 能不能输入负数
        type: Boolean,
        default: false
      },
      disabled: {
        type: Boolean,
        default: false
      }
    },
    data () {
      return {
        numValue: '',
        timer: 0
      }
    },
    watch: {
      money (newValue) {
        this.numValue = newValue
        if (newValue) {
          this.numValue = this.formater(newValue.toString())
        }
      }
    },
    mounted () {
      if (this.money && this.money.toString) {
        this.numValue = this.formater(this.money.toString())
      }
    },
    methods: {
      formater (value, checkLastPoint) {
        let ret
        if (this.canMinus) {
          ret = value.replace(/\.\d{2,}$/,value.substr(value.indexOf('.'),3)).replace(".", "$#$").replace(/\./g, "").replace("$#$", ".").replace(/[^\d.-]/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',')
        } else {
          ret = value.replace(/\.\d{2,}$/,value.substr(value.indexOf('.'),3)).replace(".", "$#$").replace(/\./g, "").replace("$#$", ".").replace(/[^\d.]/g, '').replace(/\B(?=(\d{3})+(?!\d))/g, ',')
        }
        let indexPoint = ret.indexOf('.')
        if (checkLastPoint && indexPoint === ret.length - 1) {
          ret = this.clearLastPoint(ret)
        }
        // 限制不能超过亿
        if (this.limitYI) {
          if (indexPoint > 0) {
            let back = ret.substring(indexPoint, ret.length)
            let front = ret.substring(0, indexPoint)
            ret = front.substring(0, 12) + back
          } else {
            ret = ret.substring(0, 12)
          }
        }
        return ret
      },
      clearLastPoint (value) {
        let ret = value
        let indexPoint = ret.indexOf('.')
        if (indexPoint === ret.length - 1) {
          ret = ret.substring(0, ret.length - 1)
        }
        return ret
      },
      change (event) {
        // this.value = this.value.replace(/[^\d.]/g,'').replace(/\B(?=(\d{3})+(?!\d))/g, ',')
        // let num = Number(event.target.value)
        // event.target.value = num.toLocaleString('en-IN', {maximumFractionDigits: 2})
        event.target.value = this.formater(event.target.value)
        if (this.timer) {
          clearTimeout(this.timer)
          this.timer = 0
        }
        let that = this
        this.timer = setTimeout(function () {
          if (that.canMinus) {
            that.numValue = event.target.value.replace(/[^\d.-]/g, '')
          } else {
            that.numValue = event.target.value.replace(/[^\d.]/g, '')
          }
          that.$emit('update:money', that.numValue)
          that.numValue = that.formater(that.numValue.toString())
        }, 500)
      },
      blur (event) {
        if (this.canMinus) {
          this.numValue = event.target.value.replace(/[^\d.-]/g, '')
        } else {
          this.numValue = event.target.value.replace(/[^\d.]/g, '')
        }
        this.numValue = this.clearLastPoint(this.numValue)
        this.$emit('update:money', this.numValue)
        this.numValue = this.formater(this.numValue.toString(), true)
      }
    }
  }
</script>

